*{
  margin:0;
  padding: 0;
  box-sizing: border-box;
}
 
body{
  background: #eee;
  background: linear-gradient(to right bottom, rgb(226, 230, 233), rgb(11, 2, 61))
}

.container{
  width: 1200px;
  margin: 30px auto;
  background: white;
  overflow: hidden;
  padding: 20px;
}

hr{
  margin: 15px 0;
}

.hero-list{
  margin: 0 -10px;
}

.hero-item{
  width: 10%;
  float:left;
  padding: 0 10px;
}

.hero-item img{
  width: 100%;
  border-radius: 0 15px 0 15px;
}

.hero-item p{
  text-align: center;
  margin: 0 auto 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
}